<template>
	<view class="content">
		<view class="btns">
			<view class="b1" :class="{active:active==1}" @click="tabClick(1)">{{$t('index.shengpingfu2')}}</view>
		</view>
		<template v-if="info&&active==1">
			<view class="c-item-jifen c-item-home">
				<view class="c-item-j">{{$t('index.gongsi')}}</view>
				<view class="c-item-j">{{$t('index.zhudui')}}</view>
				<view class="c-item-j">{{$t('index.pingju')}}</view>
				<view class="c-item-j">{{$t('index.kedui')}}</view>
				<view class="c-item-j">{{$t('index.shijian')}}</view>
			</view>
			<view class="c-item-jifen" v-for="(item,index) in info.odds" :key="index">
				<view class="c-item-j">{{companyInfo.company_name}}</view>
				<view class="c-item-j">{{item.home}}</view>
				<view class="c-item-j">{{item.ping}}</view>
				<view class="c-item-j">{{item.away}}</view>
				<view class="c-item-j" style="color:#ffaf01">{{item.change_time}}</view>
			</view>
		</template>
	</view>
</template>

<script>
	import {
		mapGetters,
		mapMutations
	} from 'vuex'
	export default {
		computed: {
			...mapGetters(['userInfo', 'api', 'config']),
		},
		components: {},
		data() {
			return {
				matchId:'',
				typeName:'',//lq表示篮球 zq表示足球
				active:1,
				info:'',//让球
				infoZjq:'',//总进球
				companyInfo:'',//公司信息
			}
		},
		onLoad(eq) {
			console.log(eq);
			this.typeName=eq.typeName
			this.matchId=eq.matchId
			this.companyId=eq.companyId
			if(this.typeName=='zq'){
				//胜平负
				this.zqmatchOddsEuroHistory()
			}else{
				//胜平负
				this.lqmatchOddsEuroHistory()
			}
			
		},
		methods: {
			navigatorTo(item){
				uni.navigateTo({
					url: '',
					success: res => {},
					fail: () => {},
					complete: () => {}
				});
			},
			tabClick(index){
				this.active=index
			},
			lqmatchOddsEuroHistory() {
				uni.$u.http.get(this.api.api_v1_bkdata_matchOddsEuroHistory, {
					params: {
						matchId: this.matchId,
						type:1,//1亚指 2大小 默认亚指
						companyId:this.companyId,
					}
				}).then(res => {
					if (res.code == 200) {
						this.info = res.data
						this.companyInfo = res.data.company.find(item=>item.company_id==this.companyId)
					}
				})
			},
			zqmatchOddsEuroHistory() {
				uni.$u.http.get(this.api.api_v1_fbdata_matchOddsEuroHistory, {
					params: {
						matchId: this.matchId,
						type:1,//1亚指 2大小 默认亚指
						companyId:this.companyId,
					}
				}).then(res => {
					if (res.code == 200) {
						this.info = res.data
						this.companyInfo = res.data.company.find(item=>item.company_id==this.companyId)
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		color: #fff;font-size: 14px;
		.btns{
			display: flex;justify-content: center;align-items: center;padding: 10px;width: 100%;gap:20px;
			.b1{
				padding: 5px 10px;border-radius: 20px;font-size: 14px;background-color: #242448;text-align: center;
			}
			.active{
				background-color: #ffaf01;
			}
		}
		.title{
			color: #ffaf01;padding:5px 10px;
		}
		.c-item-home{
			background-color: rgba(0, 54, 72, 0.5);
		}
		.c-item-jifen{
			display: flex;width: 100%;border-top: 1px solid #003648;box-sizing: border-box;color: #a8a8a8;
			.c-item-j{
				flex: 1;align-items: center;justify-content: center;display: flex;text-align: center;border-right: 1px solid #003648;padding:10px 0;
			}
		}
	}
</style>